<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="admin/_fragment::head(~{::title})">
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <!-- 兼容移动端和PC端 -->
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" th:href="@{../css/semantic-UI/semantic.min.css}">
  <link rel="stylesheet" th:href="@{../lib/editormd/css/editormd.min.css}">
  <link rel="stylesheet" th:href="@{../css/me.css}">
  <title>发布博客</title>
</head>
<body>


<div class="m-container-small m-padded-tb-massive" style="max-width: 30em !important;">
  <div class="ur container">
    <div class="ui middle aligned center aligned grid">
      <div class="column">
        <h2 class="ui teal image header">
          <div class="content">
            管理后台登入
          </div>
        </h2>
        <form class="ui large form" method="post" action="#" th:action="@{/admin/login}">
          <div class="ui stacked segment">
            <div class="field">
              <div class="ui left icon input">
                <i class="user icon"></i>
                <input type="text" name="username" placeholder="登入用户名">
              </div>
            </div>
            <div class="field">
              <div class="ui left icon input">
                <i class="lock icon"></i>
                <input type="password" name="password" placeholder="密码">
              </div>
            </div>
            <button class="ui fluid large teal submit button">登入</button>
          </div>
          <div class="ui error mini message"></div>

          <!--如果message是空的，就不显示，否则就显示信息-->
          <div class="ui mini negative  message" th:unless="${#strings.isEmpty(msg)}" th:text="${msg}">
          </div>
        </form>
      </div>
    </div>
  </div>
</div>

  <!--/*/<th:block th:replace="admin/_fragment :: script">/*/-->
<script th:src="@{../js/Jquery.js}"></script>
<script th:src="@{../css/semantic-UI/semantic.min.js}"></script>
<script th:src="@{../lib/editormd/editormd.min.js}"></script>
  <!--/*/</th:block>/*/-->

<!--雪花特效-->
<script th:src="@{http://www.lmlblog.com/winter/templets/xq/js/snowy.js}"></script>
<script th:src="@{http://www.lmlblog.com/blog/14/js/Snow.js}"></script>
<style type="text/css">
  .snow-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100001;}
</style>
<div class="snow-container"></div>
<!---->

<script>

  // 表单验证
  $(".ui.form").form({
    fields : {
      username: {
        identifier: 'username',
        rules: [{
          type: 'empty',
          prompt: '请输入用户名'
        }]
      },
      password: {
        identifier: 'password',
        rules: [{
          type: 'empty',
          prompt: '请输入密码'
        }]
      }
    }
  })
</script>
</body>
</html>